<script type="text/javascript">

    let mainDom = document.querySelector(".main");

    mainDom.addEventListener("click", function(event) {
        if (event.target && event.target.classList.contains("delete")) {
            let imgDiv = event.target.parentNode;
            let picDiv = imgDiv.parentNode;
            picDiv.removeChild(imgDiv);

            // 删除服务器端的图片文件
            let albumName = picDiv.dataset.name;
            let filename = imgDiv.querySelector("img").src.match(/(?<=\/)[\w]{1,}$/).join("");
            fetch(`/delete-pic?albumName=${albumName}&filename=${filename}`, {
                method: "delete"
            }).then(res => {
                if (!res.json) {
                    console.log("the response body is null");
                }
            });            
        }
    });
</script>